<template>
  <div>
    <el-group-title class="d_jump" index="addInformation">
      <template slot="groupTitle">
        <el-form
          :model="form"
          :rules="rules"
          ref="form"
          label-width="91px"
          class="ccui-form"
        >
          <el-row>
            <el-col :span="20">
              <el-form-item
                label="冲销原因："
                prop="writeoffReason"
                class="ccui-form-textArea el-form-item-textarea"
              >
                <el-input
                  type="textarea"
                  placeholder="请输入冲销原因"
                  v-model="form.writeoffReason"
                  show-word-limit
                  style="min-height: 100px"
                  resize="none"
                  rows="4"
                  maxlength="1000"
                  @change="setList"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item
                label="填报单位："
                prop="reportInOrgName"
                class="el-form-item-box"
              >
                <el-select
                  class="select-supply"
                  v-model="form.reportInOrgName"
                  placeholder="请选择填报单位"
                  @change="changeReportInOrgId"
                >
                  <el-option
                    v-for="item in reportOptions"
                    :key="item.orgId"
                    :label="item.name"
                    :value="item.name"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="冲销单编号："
                prop="writeoffCode"
              >
                <el-input
                  v-model="form.writeoffCode"
                  :value="form.writeoffCode"
                  class="ccui-form-shortInput"
                  @change="setList"
                  disabled
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="冲销单名称："
                prop="writeoffName"
              >
                <el-input
                  v-model="form.writeoffName"
                  :value="form.writeoffName"
                  class="ccui-form-shortInput"
                  @change="setList"
                  maxlength="300"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item class="el-form-item-box" label="冲销期间：">
                <el-date-picker
                  v-model="form.reversal"
                  :clearable="false"
                  align="right"
                  type="daterange"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  value-format="yyyy-MM-dd"
                  disabled
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="12">
              <el-form-item
                label="结算单编号："
                prop="settlementCode"
                class="el-form-item-box has-btn"
              >
                <el-row>
                  <el-col :span="24">
                    <el-input
                      v-model="form.settlementCode"
                      placeholder="请选择结算单编号"
                      disabled
                    ></el-input>
                  </el-col>
                  <el-col :span="3">
                    <codeNumber
                      @inventoryConfirm="codeNumberInventoryConfirm"
                      ref="selectHandle"
                      :reportInOrgId="form.reportInOrgId"
                    ></codeNumber>
                  </el-col>
                  <el-button
                    class="select-btn"
                    @click="selectHandle"
                    plain
                    style="position: absolute"
                    type="single-number"
                  >
                    <span>选择</span>
                  </el-button>
                </el-row>
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="结算单名称："
                prop="settlementName"
              >
                <el-input
                  v-model="form.settlementName"
                  :value="form.settlementName"
                  class="ccui-form-shortInput"
                  disabled
                  @change="setList"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="合同编号："
                prop="contractCode"
              >
                <el-input
                  v-model="form.contractCode"
                  readonly
                  class="ccui-form-shortInput"
                  disabled
                  @change="setList"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="合同名称："
                prop="contractName"
              >
                <el-input
                  v-model="form.contractName"
                  readonly
                  class="ccui-form-shortInput"
                  disabled
                  maxlength="15"
                  @change="setList"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="供应商："
                prop="supplierName"
              >
                <el-input
                  v-model="form.supplierName"
                  readonly
                  class="ccui-form-shortInput"
                  disabled
                  @change="setList"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="合同金额："
                prop="contractMoney"
              >
                <el-input
                  v-model="form.contractMoney"
                  readonly
                  class="ccui-form-shortInput"
                  disabled
                  maxlength="15"
                  @change="setList"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="冲销金额："
                prop="bqSetmoney"
                @keyup.native="form.writeoffMoney = oninput(form.writeoffMoney)"
              >
                <el-input
                  v-model="form.writeoffMoney"
                  class="ccui-form-shortInput"
                  disabled
                  @change="setList"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="运输产品类别："
                prop="transportProductName"
              >
                <el-input
                  v-model="form.transportProductName"
                  class="ccui-form-shortInput"
                  disabled
                  @change="setList"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="编制人："
                prop="reportUsername"
              >
                <el-input
                  v-model="form.reportUsername"
                  class="ccui-form-shortInput"
                  maxlength="15"
                  disabled
                  @change="setList"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                class="el-form-item-box"
                label="编制日期："
                prop="reportTime"
              >
                <el-date-picker
                  v-model="form.reportTime"
                  :clearable="false"
                  align="right"
                  type="date"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  value-format="yyyy-MM-dd"
                  disabled
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="13">
              <el-form-item
                label="备注："
                prop="remarks"
                class="ccui-form-textArea el-form-item-textarea"
              >
                <el-input
                  type="textarea"
                  placeholder="请输入备注"
                  v-model="form.remarks"
                  show-word-limit
                  style="min-height: 100px"
                  resize="none"
                  rows="4"
                  maxlength="1000"
                  @change="setList"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </template>
    </el-group-title>
    <!-- 填报单位 -->
    <choose-supplier
      ref="reportInOrgVisible"
      :supplierData="reportInOrgObj"
      @selectPartyB="selectReportInOrg"
    />
  </div>
</template>

<script>
import codeNumber from "../addPages/codeNumber";
import jsList from "../js";
import ChooseSupplier from "../../../../../basa/components/public/chooseSupplier";
import { addUrlPerFix } from "../../../../../basa/utils";
import { getUserInfo, getReportInOrgData } from "@/basa/api";
import { getSettlementById } from "../../api/settlement-written-off";
export default {
  name: "addInformation.vue",
  components: { ChooseSupplier, codeNumber },
  props: {
    settlementList: {
      type: Array
    }
  },
  computed: {
    pickerOptions1() {
      let that = this;
      return {
        disabledDate: function (time) {
          if (that.form.measureEndData) {
            return (
              time.getTime() > new Date(that.form.measureEndData).getTime()
            );
          } else {
            return false;
          }
        }
      };
    },
    pickerOptions2() {
      let that = this;
      return {
        disabledDate: function (time) {
          if (that.form.measureBeginData) {
            return (
              time.getTime() < new Date(that.form.measureBeginData).getTime()
            );
          } else {
            return false;
          }
        }
      };
    }
  },
  data() {
    return {
      reportInOrgObj: {
        title: "填报单位查询",
        tableHeadOptions: jsList.reportInOrgTableHead,
        tableData: [],
        recordsTotal: 0,
        formDate: {
          mainType: "A",
          orgid: "",
          pageNo: 1,
          pageSize: 20
        }
      },
      reportOptions: [], // 填报单位
      reportInOrgName: "",
      form: {
        reportInOrgName: "",
        writeoffCode: "",
        writeoffName: "",
        writeoffReason: "",
        reversal: "",
        settlementCode: "",
        settlementName: "",
        contractCode: "",
        contractName: "",
        supplierName: "",
        contractMoney: "",
        bqSetCount: "",
        bqSetmoney: "",
        reportUsername: "",
        reportTime: "",
        remarks: "",
        transportProductName: ""
      },
      hobbyList: [],
      rules: {
        writeoffReason: [
          {
            required: true,
            message: "请填写冲销原因",
            trigger: "blur"
          }
        ],
        reportInOrgName: [
          { required: true, message: "请输入填报单位", trigger: "change" }
        ],

        writeoffName: [
          {
            required: true,
            message: "请填写冲销单名称",
            trigger: "blur"
          }
        ],
        settlementCode: [
          {
            required: true,
            message: "请选择结算单编号",
            trigger: "change"
          }
        ],
        reversal: [
          {
            required: true,
            message: "请选择冲销期间",
            trigger: "blur"
          }
        ],
        writeoffMoney: [
          {
            required: true,
            message: "请填写冲销金额",
            trigger: "blur"
          }
        ],
        reportUsername: [
          {
            required: true,
            message: "请填写编制人",
            trigger: "blur"
          }
        ],
        reportTime: [
          {
            required: true,
            message: "请选择编制日期",
            trigger: "blur"
          }
        ]
      },
      taxRateList: [],
      isEdit: false
    };
  },
  watch: {
    $route(to, from) {
      if (to.name == "contracts-contractMeasurement-add-item") {
        this.addDate();
      }
    }
  },
  activated() {
    this.getUserInfo();
    this.addDate();
  },
  mounted() {
    this.isEdit = this.$store.state.isEdit;
  },
  methods: {
    selectHandle() {
      this.$refs.selectHandle.selectHandle();
    },
    // 获取当前日期
    addDate() {
      let nowDate = new Date();
      let date = {
        year: nowDate.getFullYear(),
        month: nowDate.getMonth() + 1,
        date: nowDate.getDate()
      };
      this.form.reportTime = date.year + "-" + date.month + "-" + date.date;
    },
    getUserInfo() {
      getUserInfo(
        addUrlPerFix(process.env.VUE_APP_BASEP_URL) + "/apis/basap/getUserInfo",
        {}
      ).then(res => {
        this.form.compileUser = res.data.data.userInfo.name;
        this.userOpenId = res.data.data.userInfo.openId;
        // this.form.reportOpenid = res.data.data.userInfo.openId;
        this.form.reportUsername = res.data.data.userInfo.name;
        this.getReportInOrgData(res.data.data.userInfo.openId);
      });
    },
    // 填报单位
    selectReportInOrg(val) {
      if (val.status === "confirm") {
        this.form.reportInOrgId = val.confirmSelect.orgId;
        this.form.reportInOrgName = val.confirmSelect.name;
        // this.form.reportUsername = val.confirmSelect.userName;
      } else {
        switch (val.status) {
          case "search":
            this.reportInOrgObj.formDate = val.formDate;
            break;
          case "pageSize":
            this.reportInOrgObj.formDate.pageSize = val.pageSize;
            break;
          case "pageNo":
            this.reportInOrgObj.formDate.pageNo = val.pageNo;
            break;
          case "reset":
            this.reportInOrgObj.formDate = {
              mainType: "A",
              orgid: "",
              pageNo: 1,
              pageSize: 20
            };
            break;

          default:
            break;
        }
        this.getReportInOrgData(this.userOpenId);
      }
    },
    // 填报信息
    getReportInOrgData(openId) {
      getReportInOrgData({ openIds: [openId] }).then(res => {
        this.reportInOrgObj.tableData = res.data.data[openId];
        this.reportInOrgObj.recordsTotal = res.data.data[openId].length;
        this.reportOptions = res.data.data[openId];
        this.form.reportInOrgName =
          this.form.reportInOrgName || this.reportOptions[0].name;
        this.form.reportInOrgId =
          this.form.reportInOrgId || this.reportOptions[0].orgId;
      });
    },
    changeReportInOrgId(data) {
      this.form.reportInOrgId = this.reportInOrgObj.tableData.filter(item => {
        return item.name === data;
      })[0].orgId;
      this.form.settlementCode = "";
      this.form.settlementName = "";
      this.form.contractId = "";
      this.form.contractCode = "";
      this.form.contractName = "";
      this.form.supplierId = "";
      this.form.supplierCode = "";
      this.form.supplierName = "";
      this.form.contractMoney = "";
      this.form.writeoffMoney = "";
      this.form.transportProductName = "";
      this.form.transportProductType = "";
      this.form.reversal = "";
      this.$nextTick(() => {
        this.$refs.form.clearValidate();
      });
    },
    // 选择返回数据
    codeNumberInventoryConfirm(data) {
      this.form.settlementId = data.id;
      this.form.settlementCode = data.settlementCode;
      this.form.settlementName = data.settlementName;
      this.form.contractId = data.contractId;
      this.form.contractCode = data.contractCode;
      this.form.contractName = data.contractName;
      this.form.supplierId = data.supplierId;
      this.form.supplierCode = data.supplierCode;
      this.form.supplierName = data.supplierName;
      this.form.transportProductName = data.transportProductName;
      this.form.transportProductType = data.transportProductType;

      this.form.contractMoney =
        data.contractMoney !== null ? (+data.contractMoney).toFixed(2) : "";
      this.form.writeoffMoney =
        data.currSetMoney !== null && data.currSetMoney !== undefined
          ? (+data.currSetMoney).toFixed(2)
          : "";

      this.form.reversal = [data.settlementStart, data.settlementEnd];
      this.settlementList.splice(0, this.settlementList.length);
      getSettlementById({
        // ids: [data.id]
        id: data.id
      }).then(res => {
        for (let i = 0; i < res.data.data.settlementBOList.length; i++) {
          var obj = res.data.data.settlementBOList[i];
          obj.settlementCode = data.settlementCode;
          this.settlementList.push(obj);
        }
        this.settlementList.forEach(item => {
          // 结算单明细的表处理
          item.settlementCount =
            item.settlementCount !== null && item.settlementCount !== undefined
              ? (+item.settlementCount).toFixed(3)
              : "";
          item.settlementCountTotal =
            item.settlementCountTotal !== null &&
            item.settlementCountTotal !== undefined
              ? (+item.settlementCountTotal).toFixed(3)
              : "";

          item.unitPriceWithTax =
            item.unitPriceWithTax !== null &&
            item.unitPriceWithTax !== undefined
              ? (+item.unitPriceWithTax).toFixed(2)
              : "";

          item.moneyWithoutTax =
            item.moneyWithoutTax !== null && item.moneyWithoutTax !== undefined
              ? (+item.moneyWithoutTax).toFixed(2)
              : "";

          item.moneyWithTax =
            item.moneyWithTax !== null && item.moneyWithTax !== undefined
              ? (+item.moneyWithTax).toFixed(2)
              : "";

          item.settlementMoneyTotal =
            item.settlementMoneyTotal !== null &&
            item.settlementMoneyTotal !== undefined
              ? (+item.settlementMoneyTotal).toFixed(2)
              : "";
          // 验收单明细表的数据处理
          item.orderCount =
            item.orderCount !== null && item.orderCount !== undefined
              ? (+item.orderCount).toFixed(3)
              : "";

          item.acceptCount =
            item.acceptCount !== null && item.acceptCount !== undefined
              ? (+item.acceptCount).toFixed(3)
              : "";

          item.settlementPrice =
            item.settlementPrice !== null && item.settlementPrice !== undefined
              ? (+item.settlementPrice).toFixed(2)
              : "";
        });
      });
    },
    setList() {
      this.$store.state.information = this.form;
    },
    oninput(num) {
      //正则替换
      //后来调试发现这个函数只能用于字符串，当是数字的时候就会报此错误
      var str = num.toString();
      str = str.replace(/[^\d.]/g, ""); // 保留数字   /[^\d.]/g, ""
      str = str.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的
      str = str.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
      return str;
    },
    // 提交表单验证
    handleSubmit() {
      return new Promise((resolve, reject) => {
        this.$refs["form"].validate(valid => {
          if (valid) resolve(this.form);
          reject("first");
        });
      });
    }
  }
};
</script>

<style scoped lang="scss">
/deep/.el-col-12 {
  width: 500px;
}
.el-input /deep/ input.el-input__inner {
  width: 260px;
  height: 30px;
  border-radius: 4px;
}
.el-form-item-box {
  float: left;
  width: 361px;
  margin-left: 70px;
  margin-right: 60px;
  // 440px
}
.ccui-form .ccui-form-shortInput {
  width: 260px;
}
.ccui-form .ccui-form-textArea,
.ccui-form .ccui-form-textArea .el-textarea {
  width: 760px;
  height: 120px;
}
.el-form-item-textarea {
  float: left;
  width: 825px;
  margin-left: 70px;
}
/deep/.ccui-form .el-form-item__label {
  width: 101px !important;
  height: 30px;
  font-size: 13px;
  font-family: PingFang-SC-Medium, PingFang-SC;
  font-weight: 500;
  color: #4a4a4a;
  line-height: 29px;
}
/deep/.ccui-form .el-form-item__content {
  margin-left: 101px !important;
  width: 260px;
}
/deep/ .has-button .el-form-item__content {
  display: flex;
}
.el-button.el-button--single-number {
  padding: 0 5px;
  margin-left: 5px;
}
/deep/ .has-btn .has-btn-input .el-input__inner {
  width: 196px !important;
}
/deep/ .has-btn .el-button.el-button--single-number {
  padding: 0 10px;
  margin-left: 10px;
}
.select-supply {
  width: 260px;
}
/deep/ .select-btn .spanClass {
  color: #999;
}
</style>
